<template>
    <div>
        <!-- <div class="lunbo" style="background:green;height:150px;">轮播</div> -->
        <film-swiper>
            <!-- 遍历从后台获得的数据bannerData -->
            <div class="swiper-slide" v-for="img in bannerData" :key="img.bannerId">
                <img :src="img.imgUrl" alt="">
            </div>
        </film-swiper>
        <film-head></film-head>
    </div>
</template>
<script>
// 引入film-head
import filmHead from "@/views/film/FilmHead"
// 引入film-swiper
import filmSwiper from "@/views/film/FilmSwiper"
// 引入utils下公共的公共部分文件http.js
import http from '@/utils/http.js';
export default {
    data(){
        return {
            bannerData:[]
        }
    },
    // 有引入import就要有相应的components
    components:{
        filmHead,
        filmSwiper
    },

    mounted(){
        // 请求后台数据（API）
        http({
            // API路径（在network项下）
            url:`/gateway?type=2&cityId=150300&k=8092882`,
            headers:{
                'X-Host': 'mall.cfg.common-banner'
            }
        }).then((res) => {
            //console.log(res);
            // 将获取的data赋值给bannerData
            this.bannerData = res.data.data
        })
    }
}
</script>

